<template>
    <div class="app-container">
        <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
            <el-form-item label="返利类型" prop="payType">
                <el-select v-model="queryParams.modifySource" placeholder="请选择返利类型" clearable size="small" @change="handleQuery">
                    <el-option
                            v-for="dict in modifySourceOptions"
                            :key="dict.value"
                            :label="dict.label"
                            :value="dict.value"
                    />
                </el-select>
            </el-form-item>
            <el-form-item label="用户名" prop="userName">
                <el-input
                        v-model="queryParams.userName"
                        placeholder="请输入用户名"
                        clearable
                        size="small"
                        @keyup.enter.native="handleQuery"
                />
            </el-form-item>
            <el-form-item>
                <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
                <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
            </el-form-item>
        </el-form>

<!--        <el-row :gutter="10" class="mb8">
            <el-col :span="1.5">
                <el-button
                        type="warning"
                        plain
                        icon="el-icon-download"
                        size="mini"
                        @click="handleExport"
                        v-hasPermi="['app:payRecord:export']"
                >导出
                </el-button>
            </el-col>
            <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
        </el-row>-->

        <el-table ref="tables" v-loading="loading" :data="balanceRecordList" @selection-change="handleSelectionChange" :default-sort="defaultSort" @sort-change="handleSortChange">
            <el-table-column type="selection" width="55" align="center"/>
            <el-table-column label="序号" type="index" width="50" align="center">
                <template slot-scope="scope">
                    <span>{{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}</span>
                </template>
            </el-table-column>
            <el-table-column label="用户名" sortable="custom" align="center" prop="userName"/>
            <el-table-column label="返利金额" align="center" prop="money"/>
            <el-table-column label="账户余额" align="center" prop="modifyAfterBalance"/>
            <el-table-column label="返利来源" align="center" :formatter="modifySourceFormat" prop="modifySource"/>
            <el-table-column label="备注" align="center" prop="remark"/>
        </el-table>

        <pagination
                v-show="total>0"
                :total="total"
                :page.sync="queryParams.pageNum"
                :limit.sync="queryParams.pageSize"
                @pagination="getList"
        />

    </div>
</template>

<script>
import { listBalanceRecord } from '@/api/app/payRecord'
import { listUser } from '@/api/system/user'

export default {
    name: 'PayRecord',
    components: {},
    data() {
        return {
            // 遮罩层
            loading: true,
            // 选中数组
            ids: [],
            // 非单个禁用
            single: true,
            // 非多个禁用
            multiple: true,
            // 显示搜索条件
            showSearch: true,
            // 总条数
            total: 0,
            // APP交易记录表格数据
            balanceRecordList: [],
            // 日期范围
            dateRange: [],
            // 弹出层标题
            title: '',
            // 是否显示弹出层
            open: false,
            // 支付类型字典
            modifySourceOptions: [{ value: 1, label: '签到' }, { value: 6, label: '下级返利' }],
            rechargeState: [{ value: 0, label: '待充值' }, { value: 1, label: '充值成功' }, { value: 2, label: '充值失败' }],
            fastState: [{ value: 0, label: '慢充' }, { value: 1, label: '快充' }],
            // 购买类型字典
            buyTypeOptions: [],
            // 查询参数
            queryParams: {
                pageNum: 1,
                pageSize: 10,
                modifySource: null,
                userId: null,
                userName: null,
            },
            // 默认排序
            defaultSort: {prop: 'createTime', order: 'descending'},
            // 表单参数
            form: {},
            // 表单校验
            rules: {}
        }
    },
    created() {
        this.getList()
    },
    methods: {
        /** 查询APP交易记录列表 */
        getList() {
            this.loading = true
            listBalanceRecord(this.addDateRange(this.queryParams, this.dateRange)).then(
                    (response) => {
                        this.balanceRecordList = response.rows
                        this.total = response.total
                        this.loading = false
                    }
            )
        },
        /** 排序触发事件 */
        handleSortChange(column, prop, order) {
            this.queryParams.orderByColumn = column.prop
            this.queryParams.isAsc = column.order
            this.getList()
        },
        // 商品类型字典翻译 变更来源（1签到，2连续签到奖励，3福利社提现，4提现申请，5提现驳回，6下级会员收益，7下下级会员收益
        modifySourceFormat(row, column) {
            if (row.modifySource == 1) {
                return '签到'
            }
            if (row.modifySource == 2) {
                return '连续签到奖励'
            }
            if (row.modifySource == 3) {
                return '福利社提现'
            }
            if (row.modifySource == 4) {
                return '提现申请'
            }
            if (row.modifySource == 5) {
                return '提现驳回'
            }
            if (row.modifySource == 6) {
                return '下级会员收益'
            }
            if (row.modifySource == 7) {
                return '下下级会员收益'
            }
        },
        // 取消按钮
        cancel() {
            this.open = false
            this.reset()
        },
        // 表单重置
        reset() {
            this.form = {
                recordId: null,
                payType: null,
                payMoney: null,
                userId: null,
                buyType: null,
                orderNum: null,
                phone: null,
                param: null,
                tradeNo: null,
                buyerUserId: null,
                status: '0',
                delFlag: null,
                createBy: null,
                createTime: null,
                updateBy: null,
                updateTime: null,
                callbackData: null,
                prepayId: null,
                transactionId: null,
                timeEnd: null,
                remark: null
            }
            this.resetForm('form')
        },
        /** 搜索按钮操作 */
        handleQuery() {
            this.queryParams.pageNum = 1
            this.getList()
        },
        /** 重置按钮操作 */
        resetQuery() {
            this.dateRange = []
            this.resetForm('queryForm')
            this.$refs.tables.sort(this.defaultSort.prop, this.defaultSort.order)
            this.handleQuery()
        },
        // 多选框选中数据
        handleSelectionChange(selection) {
            this.ids = selection.map(item => item.recordId)
            this.single = selection.length !== 1
            this.multiple = !selection.length
        },
        /** 修改按钮操作 */
        handleUpdate(row) {
            this.reset()
            const recordId = row.recordId || this.ids
            getPayRecord(recordId).then(response => {
                this.form = response.data
                this.open = true
                this.title = '修改APP交易记录'
            })
        },
        handleUpdateRechargeState(row) {
            const recordId = row.recordId
            this.$confirm('是否确认充值成功?', '警告', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(function() {
                return updateRechargeState(recordId, 1)
            }).then(() => {
                this.getList()
                this.msgSuccess('操作成功')
            })
        },
        handleRefund(row) {
            const recordId = row.recordId
            this.$confirm('是否确认退款?', '警告', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(function() {
                return refund(recordId)
            }).then(() => {
                this.getList()
                this.msgSuccess('操作成功')
            })
        },
        /** 导出按钮操作 */
        handleExport() {
            const queryParams = this.queryParams
            this.$confirm('是否确认导出所有APP交易记录数据项?', '警告', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(function() {
                return exportPayRecord(queryParams)
            }).then(response => {
                this.download(response.msg)
            })
        }
    }
}
</script>
